// 引入 pinia 的 defineStore 方法
import { defineStore } from 'pinia'
// 引入路由实例和重置路由方法
import router, { resetRouter } from "../router";


// 动态添加菜单路由
function addNewRoute(menuList) {
    console.log(menuList)
    // 获取当前路由配置
    let routes = router.options.routes
    console.log(routes)
    routes.forEach(routeItem => {
        // 只在 /Index 路由下添加子路由
        if (routeItem.path == "/Index") {
            menuList.forEach(menu => {
                // 构造子路由对象
                // 自动补全 .vue 后缀，防止后端未带后缀导致 404
                let compPath = menu.menucomponent.endsWith('.vue') ? menu.menucomponent : menu.menucomponent + '.vue'
                let childRoute = {
                    path: '/' + menu.menuclick,
                    name: menu.menuname,
                    meta: {
                        title: menu.menuname
                    },
                    component: () => import('../components/' + compPath)
                }

                // 添加到 children 数组
                routeItem.children.push(childRoute)
            })
        }
    })

    // 重置并重新挂载路由
    // 先重置路由
    resetRouter()
    // Vue3 动态添加路由，遍历 /Index 的 children
    routes.forEach(routeItem => {
        if (routeItem.path === '/Index' && Array.isArray(routeItem.children)) {
            routeItem.children.forEach(child => {
                // addRoute(parentName, route)
                router.addRoute('index', child)
            })
        }
    })
}


// 菜单 store，管理菜单数据和动态路由
export const useMenuStore = defineStore('menu', {
    state: () => ({
        // 菜单数据
        menu: []
    }),
    actions: {
        // 设置菜单并动态添加路由
        setMenu(menuList) {
    // 转换为 Aside 需要的字段结构
    this.menu = menuList.map(item => ({
        menuclick: item.menuclick || item.path?.replace(/^\//, '') || '',
        menuname: item.menuname || item.name || '',
        menuicon: item.menuicon || (item.meta && item.meta.icon) || 'Menu'
    }))
    addNewRoute(menuList)
}
    },
    getters: {
        // 获取菜单数据
        getMenu: (state) => state.menu
    }
})
